<!DOCTYPE html>
<!--
  ~ Copyright (C) 2016 Jecelyin Peng <jecelyin@gmail.com>
  ~
  ~ This file is part of 920 Text Editor.
  ~
  ~ Licensed under the Apache License, Version 2.0 (the "License");
  ~ you may not use this file except in compliance with the License.
  ~ You may obtain a copy of the License at
  ~
  ~      http://www.apache.org/licenses/LICENSE-2.0
  ~
  ~ Unless required by applicable law or agreed to in writing, software
  ~ distributed under the License is distributed on an "AS IS" BASIS,
  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  ~ See the License for the specific language governing permissions and
  ~ limitations under the License.
  -->

<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>920 Text Editor</title>
<link rel="stylesheet" href="css/animation.css">
<!--<base href="file:///android_asset/" />-->
<style type="text/css" media="screen">
body {
    overflow: hidden;
}

#editor {
    margin: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
#searchbar {
    position: absolute;
    top: 0;
    left: 0;
}
@font-face {
    font-family: 'fontello';
    src: url('./font/fontello.eot?33416430');
    src: url('./font/fontello.eot?33416430#iefix') format('embedded-opentype'),
    url('./font/fontello.woff?33416430') format('woff'),
    url('./font/fontello.ttf?33416430') format('truetype'),
    url('./font/fontello.svg?33416430#fontello') format('svg');
    font-weight: normal;
    font-style: normal;
}

.css-icon
{
    font-family: "fontello";
    font-style: normal;
    font-weight: normal;
    speak: none;

    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    /* opacity: .8; */

    /* For safety - reset parent styles, that can break glyph codes*/
    font-variant: normal;
    text-transform: none;

    /* fix buttons height, for twitter bootstrap */
    line-height: 1em;

    /* Animation center compensation - margins should be symmetric */
    /* remove if not needed */
    margin-left: .2em;

    /* You can be more comfortable with increased icons size */
    /* font-size: 120%; */

    /* Font smoothing. That was taken from TWBS */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    /* Uncomment for 3D effect */
    /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}

#searchbar {
    background: #ececec;
    font-size: 13px;
    width: 100%;
}
#searchbar #close_box {
    border-top: 1px solid #DDDDDD;
    border-bottom: 1px solid #c0c0c0;
    text-align: center;
}
#searchbar input {
    border: 1px solid #dbdbdb;
    background: #fff;
    padding: 5px;
    width: 60%;

}
#searchbar #search_box {
    margin: 10px;
}
#searchbar #replace_box {
    margin: 0 10px 10px 10px;
}
#searchbar #search_box i, #searchbar #replace_box i {
    padding: 7px;
    border: 1px solid #ccc;
    width: 12%;
}
#searchbar #search_box i:active, #searchbar #replace_box i:active {
    background:#d6d6d6;
}

#searchbar.ace_dark {
    background: #3c3f41;
    color: #c9c9c9;
}
#searchbar.ace_dark #close_box {
    border-top: 1px solid #555555;
    border-bottom: 1px solid #323232;
}
#searchbar.ace_dark input {
    border: 1px solid #646464;
    background: #45494a;
    color: #c9c9c9;
}

#searchbar.ace_dark #search_box i, #searchbar.ace_dark #replace_box i {
    border: 1px solid #646464;
}
#searchbar.ace_dark #search_box i:active, #searchbar.ace_dark #replace_box i:active {
    background:#5c5d60;
}
</style>

</head>
<body>
<div id="editor">

</div>
<script type="text/tpl" id="code" style="display:none">
<!--
[PATH]/storage/emulated/0/1/README.md[/PATH]
1    6:6	 C#, Erlang, Frink, HTML/XML/WML, CSS, HTML/HTM
1   31:31	1. preview the HTML file
1   41:41	 C#, Erlang, Frink, HTML/XML/WML, CSS, J
1   64:64	1. 预览HTML文件

[PATH]/storage/emulated/0/1/support.php[/PATH]
2    4:4	<!DOCTYPE html PUBLIC "-//W3C/
2    5:5	<html xmlns="http://w
2    7:7	Type" content="text/html;charset=UTF-8"/
2   16:16	</html>
-->
</script>
<script src="ace/src/ace.js" type="text/javascript"></script>
<script src="ace/src/ext-modelist.js" type="text/javascript"></script>
<script src="bridge.js" type="text/javascript"></script>
<script>
    var modelist = require("ace/ext/modelist");
    window.findText = "html";
    var editor = ace.edit("editor");
    editor.setShowInvisibles(true);
    editor.setTheme('ace/theme/chrome');
    editor.getSession().setUseWrapMode(true);
    editor.renderer.setAnimatedScroll(true);
    editor.getSession().setUndoSelect(false);
    editor.session.setMode("ace/mode/search");
    editor.setValue(document.getElementById("code").innerHTML, -1);
    editor.selection.on('changeCursor', function (e, selection) {
        var lead = selection.getSelectionLead();
        var token = selection.session.getTokenAt(lead.row, lead.column);
        if (!token || token.type !== 'keyword')return;
        var doc = selection.session.getDocument();
        var text = doc.getLine(lead.row);
        var match = /^(\d+)\s/.exec(text);
        if (!match)return;

    });
</script>
</body>
</html>